//
//  ListStudy.swift
//  NaiCha
//
//  Created by 唐安坤 on 2024/9/6.
//

import SwiftUI

struct ListStudy: View {
    
    @State fileprivate var cardModels:[CardModel] = [
        CardModel(imageName: "dog01"),
        CardModel(imageName: "dog02"),
        CardModel(imageName: "dog03"),
        CardModel(imageName: "dog04"),
        CardModel(imageName: "dog05"),
    ]
    
    var body: some View {
        VStack{
            HStack{
                Text("宠物").font(.system(size: 30,weight: .bold)).padding()
                Spacer()
                    
            }
            
            List{
                ForEach(cardModels) { model in
                    CardView(imageName: model.imageName)
                }
                
            }.listStyle(.plain)
                .scrollIndicators(.hidden)
                
                
            
        }
    }
}

fileprivate struct CardModel: Identifiable{
    var id: UUID = UUID()
    var imageName: String
}

private struct CardView: View {
    
    @State var imageName: String
    var body: some View {
        VStack{
            HStack{
                Text("哈士奇-公").font(.system(size: 20,weight: .bold)).padding()
                Spacer()
            }
            Image(imageName, bundle: nil)
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame( height: 200)
                .cornerRadius(20)
                .padding(.horizontal)
            HStack(alignment: .bottom){
                HStack{
                    Image(systemName: "heart.fill")
                        .font(.system(size: 12))
                        .foregroundColor(.pink)
                    Text("3.2k").font(.system(size: 12)).foregroundColor(.pink)
                }.padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                    .background(.pink.opacity(0.2))
                    .cornerRadius(/*@START_MENU_TOKEN@*/3.0/*@END_MENU_TOKEN@*/)
                HStack{
                    Image(systemName: "heart.fill")
                        .font(.system(size: 12))
                        .foregroundColor(.blue)
                    Text("3.2k").font(.system(size: 12)).foregroundColor(.blue)
                }.padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                    .background(.blue.opacity(0.2))
                    .cornerRadius(/*@START_MENU_TOKEN@*/3.0/*@END_MENU_TOKEN@*/)
                Spacer()
                
                HStack{
                    Text("$").font(.system(size: 20)).foregroundColor(.pink)
                    Text("3999").font(.system(size: 20)).foregroundColor(.pink)
                }
                
            }.padding()
            
        }
        .background(Color.white)
        .clipShape(RoundedRectangle(cornerSize: CGSize(width: 20, height: 20)))
        .shadow(color: .black.opacity(0.3), radius: 3, x: /*@START_MENU_TOKEN@*/0.0/*@END_MENU_TOKEN@*/, y: 5)
        .listRowSeparator(.hidden)
    }
}
#Preview {
    ListStudy()
}
